<template>
	<view>
		<u-popup v-model="showPop" border-radius="14" mode="bottom" z-index="11">
			<scroll-view style="height: 750rpx;" class="item" scroll-y="true">
				<view class=" px-3">
					<u-form :model="formData" ref="uForm">
						<view class="form">
							<u-form-item
								class="required"
								label="资质名称"
								label-position="top"
								prop="companyAptitudeName"
								:border-bottom="false"
							>
								<u-input
									border
									height="80"
									v-model="formData.companyAptitudeName"
									placeholder="请输入资质名称"
								/>
							</u-form-item>
							<u-form-item
								class="required"
								label="等级"
								label-position="top"
								prop="lv"
								:border-bottom="false"
							>
								<u-input border height="80" v-model="formData.lv" placeholder="请输入等级" />
							</u-form-item>

							<u-form-item
								class="required"
								label="日期"
								label-position="top"
								prop="validEndDate"
								:border-bottom="false"
							>
								<u-input
									border
									height="80"
									v-model="formData.validEndDate"
									placeholder="请选择日期"
									@click="openvalidEndDatePicker"
								/>
							</u-form-item>
							<u-form-item
								class="required"
								label="上传资质照片"
								label-position="top"
								:border-bottom="false"
								prop="uploadAptitudeFile"
							>
								<image-upload
									:dataType="1"
									name="file"
									:remove="true"
									:headers="header"
									:action="uploadFileUrl"
									v-model="uploadAptitudeFile"
									:compress="true"
									:quality="60"
									mediaType="image"
									:add="true"
									@uploadSuccess="uploadAptitudeFileFn"
								></image-upload>
							</u-form-item>
						</view>
					</u-form>
				</view>
			</scroll-view>

			<view class="d-flex py-2 j-sa">
				<button class="warningBnt btn-cancel" @click="hanglgCancelFn">取 消</button>
				<button class="primaryBnt btn-cancel" @click="hanglgConfirmFn">确 定</button>
			</view>
			<u-picker mode="time" v-model="isShow" :params="params" @confirm="handlgvalidEndDatePicker"></u-picker>
		</u-popup>
	</view>
</template>

<script>
import { uploadUrl } from '@/api/apis.js';

export default {
	data() {
		return {
			uploadFileUrl: uploadUrl,
			header: {
				token: uni.getStorageSync('ims-token')
			},
			showPop: false,
			isShow: false,
			params: {
				year: true,
				month: true,
				day: true,
				hour: false,
				minute: false,
				second: false
			},
			uploadAptitudeFile: [],
			formData: {
				companyAptitudeName: '',
				lv: '',
				validEndDate: '',
				fileVo: {}
			}
		};
	},

	methods: {
		show() {
			this.showPop = true;
		},
		openvalidEndDatePicker() {
			this.isShow = true;
		},
		handlgvalidEndDatePicker(e) {
			this.formData.validEndDate = `${e.year}-${e.month}-${e.day}`;
		},
		hanglgCancelFn() {
			this.showPop = false;
			this.uploadAptitudeFile = [];
			this.$refs.uForm.resetFields();
		},
		hanglgConfirmFn() {
			if (this.ValidRuleFn()) {
				this.$emit('confiromQualificationFn', this.$u.deepClone(this.formData));
				this.hanglgCancelFn();
			}
		},
		//上传公司证件照
		uploadAptitudeFileFn(res) {
			var _res = JSON.parse(res.data);
			this.uploadAptitudeFile.push({
				fileId: _res.data.fileId,
				fileName: _res.data.fileName,
				fileSize: _res.data.fileSize,
				fileSuffix: _res.data.fileSuffix,
				filePreviewUrl: _res.data.filePreviewUrl,
				fileDownloadUrl: _res.data.fileDownloadUrl
			});
			this.formData.fileVo = this.uploadAptitudeFile[0];
		},
		//验证码校验
		ValidRuleFn() {
			if (this.formData.companyAptitudeName == '') {
				this.$u.toast('请输入资质名称');
				return false;
			}
			if (this.formData.lv == '') {
				this.$u.toast('请输入等级');
				return false;
			}
			if (this.formData.validEndDate == '') {
				this.$u.toast('请选择日期');
				return false;
			}
			if (!this.uploadAptitudeFile.length) {
				this.$u.toast('请上传资质照片');
				return false;
			}

			return true;
		}
	}
};
</script>

<style lang="scss" scoped>
.btn-cancel {
	width: 40%;
}
</style>
